<template>
	<div></div>
	<!--<div>-->
	<!--	<a-modal :visible="visible" :title="props.data.title" centered="true" ok-text="确认" cancel-text="取消" @cancel="cancel" @ok="hideModal">-->
	<!--		<p>{{ props.data.content }}</p>-->
	<!--	</a-modal>-->
	<!--</div>-->
</template>
<script setup lang="ts">
	import {ExclamationCircleOutlined} from '@ant-design/icons-vue'
	import { createVNode, watch} from 'vue'
	import {Modal, message} from 'ant-design-vue'

	const props = defineProps({
		visible: {
			type: Boolean,
			required: true
		},
		data: {
			type: Object,
			required: true
		}
	})
	const emit = defineEmits(['update:visible', 'success'])
	const cancel = () => {
		emit('update:visible', false)
	}
	const hideModal = () => {
		if (props.data.requestMethodFun) {
			return props.data
				.requestMethodFun(props.data.seveDate)
				.then((res: any) => {
					message.success('操作成功')
					emit('success')
				})
				.finally(() => {
					cancel()
				})
		} else {
			cancel()
		}
	}
	watch(
		() => props.visible,
		(newVal: boolean) => {
			if (newVal) {
				Modal.confirm({
					title: props.data.title || '操作提示',
					centered: true,
					icon: createVNode(ExclamationCircleOutlined),
					content: props.data.content || '确定要继续该操作吗？',
					onOk() {
						hideModal()
					},
					onCancel() {
						cancel()
					}
				})
			}
		}
	)
</script>
